<template>
	<view class="bf1 f-yc mvh100" style="width: 750rpx;">
		<view class="top bf">
			<view class="f-x-bt top1 mb20">
				<view class="top1l">
					<u-subsection :list="tList" font-size="26" button-color="#fff" inactive-color="#303133" height="60" :current="navIdx" @change="typeChange"></u-subsection>
				</view>
				<view class="f-y-c">
					<view class="top1s bf6 f-c c9">
						<text class="iconfont iconss f28"></text>
						<u-input class="top1si f24"
						 v-model="query.keyword" :clearable="false"  trim placeholder="搜订单"
						 confirm-type='search'
						 @confirm="search" />
						<!-- <view class="top1si f24">搜订单</view> -->
					</view>
					<image class="top1img ml30" @click="openMap" src="/static/img/dy.png"></image>
					<image @click="go({ url: '../dp/storeset/ddsz' })" class="top1img ml30" src="/static/img/sz.png"></image>
				</view>
			</view>
		</view>
		<view class="pageorder-box">
			<view class="pageorder" :style="{ 'z-index': navIdx == 0 ? 1 : -10 }"><pending-order ref="pendingOrder"></pending-order></view>
			<view class="pageorder" :style="{ 'z-index': navIdx == 1 ? 1 : -10 }"><order-query ref="orderQuery" @openTime="openTime"></order-query></view>
		</view>
		<tab-bar style="min-height: 114rpx; height: 114rpx; max-height: 114rpx;"></tab-bar>
		<u-calendar
			v-model="showrl"
			mode="range"
			:btnstyle="{ background: '#FE9367' }"
			range-color="#FE9367"
			range-bg-color="rgba(253,215,75,0.2)"
			active-bg-color="#FE9367"
			@change="change"
		></u-calendar>
		<!-- 自动升级 热更新 自动更新 -->
		<!-- #ifdef APP-PLUS -->
		<zy-upg @close="DataUp = false" v-if="DataUp"></zy-upg>
		<!-- #endif -->
	</view>
</template>

<script>
// #ifdef APP-PLUS
import ZyUpg from "@/components/zy-upgrade/zy-upgrade.vue"
// #endif
import { mapState, mapActions } from 'vuex';
import utils from '@/common/utils.js';
import { utilMixins } from '@/common/util-mixins.js';
import PendingOrder from './components/pendingOrder.vue';
import OrderQuery from './components/orderQuery.vue';
import navTab from '@/components/common/functionCmp/nav-tab.vue';
export default {
	mixins: [utilMixins],
	name: 'order-index',
	components: {
		PendingOrder,
		OrderQuery,
		navTab,
		// #ifdef APP-PLUS
		ZyUpg,
		// #endif
	},
	data() {
		return {
			query:{
				keyword:'',
			},
			DataUp: true ,
			tList: [
				{
					name: '等待处理'
				},
				{
					name: '订单查询'
				}
			],
			navIdx: 0,
			aIdx: 0,
			dataList: [],
			isget: false,
			mygd: false,
			params: {
				page: 1,
				size: 10
			},
			iparams: {
				state: '1'
			},
			dateDef: {
				startTime: new Date().format('yyyy-MM-dd'),
				endTime: new Date().format('yyyy-MM-dd')
			},
			showjz: true,
			showrl: false
		};
	},
	computed: {},
	onLoad(options) {
		this.util.setNT('订单管理');
		let s = this.timeToDate(this.dateToTime()).substring(0, 10);
		// uni.$emit('IsLogin')
		// console.log(uni.getStorageSync('account'))
		// console.log(this.$u)
	},
	onHide() {
		this.navIdx = 0;
		this.$refs.pendingOrder.changePage();
		this.$refs.orderQuery.changePage();
	},
	methods: {
		openMap() {
			uni.navigateTo({
					url: '/yb_shd/my/printset/set'
				});
		},
		typeChange(e) {
			this.navIdx = e;
		},
		openTime() {
			this.showrl = true;
		},
		change(e) {
			this.$refs.orderQuery.change(e);
		},
		search(){
			this.$refs.orderQuery.search(this.query.keyword);
		}
	}
};
</script>
<style>
page {
	width: 100%;
	min-height: 100%;
	display: flex;
}
</style>
<style scoped lang="scss">
.top1 {
	padding: 0 20rpx;
}

.top1l {
	width: 314rpx;
}

.top1s {
	width: 170rpx;
	height: 65rpx;
	// border-radius: 40rpx;
	border-radius: 15rpx;
	padding: 6rpx 20rpx;
	margin-left: 50rpx;

	.top1si {
		margin-left: 10rpx;
	}
}

.top1img {
	width: 40rpx;
	height: 40rpx;
}

.top2 {
	.xzsj {
		padding: 0 20rpx;
	}

	.ab-r-d {
		position: relative;
		width: 1px;
		background: #a6a6a6;
		transform: scaleX(0.5) scaleY(0.33);
	}

	.ztd {
		padding: 0 10rpx 6rpx 10rpx;
		// border-radius: 42rpx 0 0 42rpx;
		border-radius: 15rpx;
		height: 55rpx;
	}
}

.pageorder-box {
	flex: 1;
	width: 100%;
	min-width: 750rpx;
	min-height: 0rpx;
	max-height: 100vh;
	position: relative;

	.pageorder {
		position: absolute;
		top: 0rpx;
		left: 0rpx;
		bottom: 0rpx;
		right: 0rpx;
		display: flex;
	}
}
</style>
